<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
    <div style="width: 500px;height: 200px;margin: 0 auto; margin-top: 500px; border-radius: 10px; background: #1e45c9">
        <div style="text-align: center">
            <form>
                <div>
                    <label style="font-size: 30px">用户名</label>
                    <div>
                        <input type="text" v-model="user.userName"/>
                    </div>
                    <label>密码</label>
                    <div>
                        <input type="text" v-model="user.userPassword"/>
                    </div>
                    <label>权限</label>
                    <div>
                        <input type="text" v-model="user.userStatus"/>
                    </div>
                    <div>
                        <button type="button" @click="update()">更新</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<script src="../js/vue.js"></script>
<script src="../js/axios.min.js"></script>
<script>
    new Vue({
        el: "#app",
        data: {
            user: {},
        },
        methods: {
            getUser(id) {
                axios.get("http://localhost:9090/user/getUser?id=" + id).then((res) => {
                    this.user = res.data.user;

                })
            },
            update(){
                axios.post("http://localhost:9090/user/update",this.user).then((res)=>{
                    if (res.data){
                        alert("更新成功")
                    } else {
                        alert("更新失败")
                    }
                })
            }
        },
        created() {
            let id = location.href.substring(location.href.indexOf("=") + 1);
            this.getUser(id);
        }
    })
</script>
</body>
</html>